<template>
<el-col :xl="8" :lg="12" :md="24" :sm="24" :xs="24">
  <el-form :model="zfbForm" :rules="rules" ref="zfbForm" label-width="170px" size="small">
    <el-form-item prop="appid" label="appid">
      <el-input v-model="zfbForm.appid"></el-input>
    </el-form-item>
    <el-form-item label="PID" prop="pid">
      <el-input v-model="zfbForm.pid"></el-input>
    </el-form-item>
    <el-form-item label="应用网关" prop="gateway">
      <el-input v-model="zfbForm.gateway"></el-input>
    </el-form-item>
    <el-form-item label="店铺通知url" prop="shop_url">
      <el-input v-model="zfbForm.shop_url" placeholder="请填写店铺通知url"></el-input>
    </el-form-item>
    <el-form-item label="授权回调地址" prop="address">
      <el-input v-model="zfbForm.address"></el-input>
    </el-form-item>
    <el-form-item label="软件生成的应用私钥" prop="private_key">
      <el-input type="textarea" :rows="5" v-model="zfbForm.private_key"></el-input>
    </el-form-item>
    <el-form-item label="开发平台的支付宝RSA公钥" prop="public_key">
      <el-input type="textarea" :rows="5" v-model="zfbForm.public_key"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" size="small" class="fr mt20" @click="submit">确认保存</el-button>
    </el-form-item>
  </el-form>
</el-col>
</template>

<script>
import { zfbAdd, zfbInit } from '@/api/setting'

export default {
  data() {
    const validateIsUndefined = (rule, value, callback) => {
      if (value === '' || value === undefined || value === null) {
        callback(new Error('不能为空哟~'))
      } else {
        callback()
      }
    }
    return {
      zfbForm: {
        appid: '',
        pid: '',
        gateway: '',
        address: '',
        shop_url: '',
        private_key: '',
        public_key: ''
      },
      rules: {
        appid: [{ required: true, trigger: 'blur', validator: validateIsUndefined }],
        pid: [{ required: true, trigger: 'blur', validator: validateIsUndefined }],
        gateway: [{ required: true, trigger: 'blur', validator: validateIsUndefined }],
        address: [{ required: true, trigger: 'blur', message: '必须填写哟~' }],
        shop_url: [{ required: true, trigger: 'blur', validator: validateIsUndefined }],
        private_key: [{ required: true, trigger: 'blur', validator: validateIsUndefined }],
        public_key: [{ required: true, trigger: 'blur', validator: validateIsUndefined }]
      }
    }
  },
  methods: {
    submit() {
      this.$refs['zfbForm'].validate((valid) => {
        if (valid) {
          zfbAdd(this.zfbForm).then(response => {
            if (response.data.errorCode === 0) {
              this.$message.success(response.data.errorMsg)
            } else {
              this.$message.error(response.data.errorMsg)
            }
          })
        } else {
          this.$message.error('表单格式有误哟~')
        }
      })
    }
  },
  created() {
    zfbInit().then(response => {
      this.zfbForm.appid = response.data.result.app_id
      this.zfbForm.pid = response.data.result.pid
      this.zfbForm.gateway = response.data.result.gateway
      this.zfbForm.address = response.data.result.address
      this.zfbForm.shop_url = response.data.result.shop_url
      this.zfbForm.private_key = response.data.result.private_key
      this.zfbForm.public_key = response.data.result.public_key
    })
  }
}
</script>